{% extends 'base.html' %}

{% import 'bootstrap/wtf.html' as wtf %}

{% block content %}
{{ super() }}
    <div class="container">
            <div class="row well">
                <form method="post" class="form" role="form">
                    {{ form.hidden_tag() }}
                    <div class="form-group">
                        {{ form.title.label }}
                        {{ form.title(id="title", class="form-control") }}
                    </div>
                    <div class="form-group">
                        {{ form.body.label }}
                        <div class="row">
                            <div class="col-md-6">
                                <div class="panel panel-default", style="height:600px;">
                                    <div class="panel-heading", style="height: 50px;">编辑区</div>
                                    <div class="panel-body", style="height: 550px;">
                                        {{ form.body(only_input=True, style="height: 100%;width:100%") }}
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="panel panel-default", style="height: 600px;">
                                    <div class="panel-heading", style="height: 50px;">编辑区</div>
                                    <div class="panel-body", style="height: 550px;">
                                        {{ form.body(only_preview=True) }}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group pull-right">
                        {{ form.submit(class='btn btn-raised') }}
                    </div>
                </form>
            </div>
    </div>
    <style>
        {
            border-style: none;
            resize: none;
        }
    .flask-pagedown-preview{

    overflow-x:hidden;
    overflow-y: auto;
    height: 100%;
}
.flask-pagedown{
    height: 100%;
}

.panel-body img{ max-width: 100%; display: block; }
    </style>
{% endblock %}
{% block script %}
    {{ super() }}
      <script type="text/javascript">
        var converter = new showdown.Converter();
        function flask_pagedown_converter(text){
            return converter.makeHtml(text);
        }
    </script>
{% endblock %}